@@include('include/head.html')
<style>
  h3 {
    margin-bottom: 20px;
  }
  h3 + .aiui-row {
    margin-bottom: 10px;
  }
</style>
<div class="aiui-row">
    <div class="aiui-col-xs6" style="padding:7.5px;">
        <div class="aiui-card">
            <div class="aiui-card-header aiui-">
                不同主题
            </div>
            <div class="aiui-card-body">
                <button class="aiui-btn aiui-btn-default">默认</button>
                <button class="aiui-btn aiui-btn-primary">主要</button>
                <button class="aiui-btn aiui-btn-success">正确</button>
                <button class="aiui-btn aiui-btn-warning">警告</button>
                <button class="aiui-btn aiui-btn-error">错误</button>
            </div>
        </div>
    </div>
    <div class="aiui-col-xs6" style="padding:7.5px;">
        <div class="aiui-card">
            <div class="aiui-card-header aiui-">
                不同大小
            </div>
            <div class="aiui-card-body">
                <button class="aiui-btn aiui-btn-lg" disabled id="info"><i class="aiui-icon aiui-icon-success"></i> 超大按钮</button>
                <button class="aiui-btn is-disabled" id="success">默认按钮</button>
                <button class="aiui-btn aiui-btn-sm" id="error">小型按钮</button>
                <button class="aiui-btn aiui-btn-xs" id="warning">迷你按钮</button>
            </div>
        </div>
    </div>
    <div class="aiui-col-xs6" style="padding:7.5px;">
        <div class="aiui-card">
            <div class="aiui-card-header aiui-">
                圆角按钮
            </div>
            <div class="aiui-card-body">
                <button class="aiui-btn aiui-btn-default is-round">默认</button>
                <button class="aiui-btn aiui-btn-primary is-round">主要</button>
                <button class="aiui-btn aiui-btn-success is-round">正确</button>
                <button class="aiui-btn aiui-btn-warning is-round">警告</button>
                <button class="aiui-btn aiui-btn-error is-round">错误</button>
            </div>
        </div>
    </div>
    <div class="aiui-col-xs6" style="padding:7.5px;">
        <div class="aiui-card">
            <div class="aiui-card-header aiui-">
                朴素按钮
            </div>
            <div class="aiui-card-body">
                <button class="aiui-btn aiui-btn-default is-plain">默认</button>
                <button class="aiui-btn aiui-btn-primary is-plain">主要</button>
                <button class="aiui-btn aiui-btn-success is-plain">正确</button>
                <button class="aiui-btn aiui-btn-warning is-plain">警告</button>
                <button class="aiui-btn aiui-btn-error is-plain">错误</button>
            </div>
        </div>
    </div>
    <div class="aiui-col-xs6" style="padding:7.5px;">
        <div class="aiui-card">
            <div class="aiui-card-header aiui-">
                按钮组
            </div>
            <div class="aiui-card-body">
                <div class="aiui-btn-group">
                    <button class="aiui-btn aiui-btn-primary">默认</button>
                    <button class="aiui-btn aiui-btn-primary">主要</button>
                    <button class="aiui-btn aiui-btn-primary">正确</button>
                    <button class="aiui-btn aiui-btn-primary">警告</button>
                    <button class="aiui-btn aiui-btn-primary">错误</button>
                </div>
            </div>
        </div>
    </div>
    <div class="aiui-col-xs6" style="padding:7.5px;">
        <div class="aiui-card">
            <div class="aiui-card-header aiui-">
                图标圆角
            </div>
            <div class="aiui-card-body">
                <button class="aiui-btn aiui-btn-default is-circle"><i class="aiui-icon aiui-icon-info"></i></button>
                <button class="aiui-btn aiui-btn-primary is-circle"><i class="aiui-icon aiui-icon-info"></i></button>
                <button class="aiui-btn aiui-btn-success is-circle"><i class="aiui-icon aiui-icon-success"></i></button>
                <button class="aiui-btn aiui-btn-warning is-circle"><i class="aiui-icon aiui-icon-warning"></i></button>
                <button class="aiui-btn aiui-btn-error is-circle"><i class="aiui-icon aiui-icon-error"></i></button>
            </div>
        </div>
    </div>
</div>
@@include('include/foot.html')
